<!--创建时间：2021/11/12 9:20 描述： -->
<template>
  <div class="index-class">
    <SqlEditComponents :code.sync="sqlCode"/>
  </div>
</template>
<!--使用ts写vue，这里的语言要修改为ts，其他的位置没有改变，写tsx语言就改成tsx-->
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
import SqlEditComponents from '@/components/SqlEdit/index.vue'
/* 这个装饰器里面写引入的组件和生命周期函数，当然，生命周期函数也是可以写在class类里面 */
@Component({
  components: { SqlEditComponents }
})
/* 这里定义的class一定要继承vue，记不住就直接模仿，class名就是之前的name属性值 */
export default class SqlEditIndex extends Vue {
  private sqlCode = 'INSERT INTO students (id, class_id, name, gender, score) VALUES (1, 1, \'小明\', \'F\', 99) ON DUPLICATE KEY UPDATE name=\'小明\', gender=\'F\', score=99;'
}
</script>
<!--本地样式-->
<style scoped lang="scss">
.index-class{
}
</style>
<!--全局样式-->
<style lang="scss">
</style>
